{extend name="base"}
{block name="main"}
<style type="text/css">
.table td, .table th{
    text-align: center;
}
.collect_txt{
    margin-left: 10px;
    color: #ccc;
}
</style>

<link href="__TPL_CSS__/demo_table.css" rel="stylesheet" >

<div class="row">
    <div class="col-sm-12">
        <section class="panel">
            <header class="panel-heading">产品转化情况统计</header>
            <div class="panel-body">
                <div class="col-sm-9">
                <a href="{:U('Collect/cls')}" class="btn btn-primary"><i class="icon-repeat"></i> 更新统计</a> <span class="collect_txt">频繁更新会消耗系统资源</span>
                </div>
                <div class="col-sm-3">最后更新时间：{$T.time|date="Y-m-d H:i:s"}</div>
            </div>
        </section>
    </div>
</div>
<div class="row">
    <div class="col-sm-12">
        <section class="panel">
            <div class="panel-body">
                <div class="col-sm-12">
                    <table class="table table-bordered table-striped table-condensed" id="example">
                      <thead>
                      <tr>
                          <th width="10%">序号</th>
                          <th width="20%">编号</th>
                          <th width="10%">派出色卡</th>
                          <th width="10%">下单客户</th>
                          <th width="10%">色卡转化率</th>
                          <th width="10%">下单数量</th>
                          <th width="10%">客单数</th>
                          <th width="10%">下单总计</th>
                          <th width="10%">客单价</th>
                      </tr>
                      </thead>
                      <tbody>
                        {volist name="T.data" id="v"}
                        <tr>
                            <td>{$i}</td>
                            <td>{$v.number}</td>
                            <td>{$v.color}</td>
                            <td>{$v.customer}</td>
                            <td>{$v.seka} %</td>
                            <td>{$v.count}</td>
                            <td>{$v.kedanshu}</td>
                            <td>{$v.total}</td>
                            <td>{$v.kedanjia}</td>
                        </tr>
                        {/volist}
                      </tbody>
                    </table>
                </div>
            </div>
        </section>
    </div>
</div>

{js href="__TPL_JS__/jquery.dataTables.js" /}

<script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
        $('#example').dataTable( {
            "aaSorting": [[ 4, "desc" ]]
        } );
    } );
</script>
{/block}
